<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:c="http://java.sun.com/jsp/jstl/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:p="http://primefaces.prime.com.tr/ui">
    <li class="clearFix widget widget_pages">
        <h3 class="widget_title">#{msgs['usercp.title']}</h3>
        <div class="usercp_welcome font_cufon">
            <h:outputFormat value="#{msgs['usercp.welcome']}">
                <f:param value = "#{currentUser.username}"/>
            </h:outputFormat>
        </div>

    <h:form id="frmChangePwd">
        <p:dialog id="dlgChangePwd" header="#{msgs['changepwd.title']}" widgetVar="dlgChangePwd" modal="true" resizable="false" width="0" styleClass="autoSizeDialog">
            <h:panelGrid columns="2" cellpadding="5" id="grdChangePwd" styleClass="tblNeedPadding">

                <h:outputLabel for="curPwd" value="#{msgs['changepwd.currentPwd']}"/>
                <p:password value="#{changePasswordController.currentPassword}" feedback="false" minLength="1"
                            id="curPwd" required="true" label="#{msgs['changepwd.currentPwd']}" validator="#{changePasswordController.validateCurrentPassword}"/>

                <h:outputLabel for="newPwd" value="#{msgs['changepwd.newPwd']}"/>
                <p:password value="#{changePasswordController.newPassword}" feedback="true" minLength="1"
                            id="newPwd" required="true" label="#{msgs['changepwd.newPwd']}"/>

                <h:outputLabel for="confirmNewPwd" value="#{msgs['changepwd.confirmNewPwd']}"/>
                <p:password value="#{changePasswordController.confirmNewPassword}" feedback="false" minLength="1"
                            id="confirmNewPwd" required="true" label="#{msgs['changepwd.confirmNewPwd']}">
                    <f:validator validatorId="confirmPasswordValidator" />
                    <f:attribute name="passwordId" value="frmChangePwd:newPwd" />
                    <f:attribute name="errorRes" value="validator.changepwd.wrongConfirmNPwd" />
                </p:password>

                <f:facet name="footer">
                    <div align="center">
                        <p:commandButton id="changePwdBtn" value="#{msgs['changepwd.changePwdText']}" image="ui-icon ui-icon-pencil" action="#{changePasswordController.changePassword}" type="submit" update="growl"/>
                        &nbsp;<p:commandButton value="#{msgs['changepwd.cancelText']}" image="ui-icon ui-icon-closethick" onclick="dlgChangePwd.hide()"/>
                    </div>
                </f:facet>
            </h:panelGrid>
        </p:dialog>
    </h:form>

    <h:form id="frmUpdateProfile">
        <p:dialog id="dlgUpdateProfile" header="#{msgs['updateProfile.title']}" widgetVar="dlgUpdateProfile" modal="true" resizable="false" width="0" styleClass="autoSizeDialog">
            <h:panelGrid columns="2" cellpadding="5" id="grdUpdateProfile" styleClass="tblNeedPadding">

                <h:outputLabel for="username" value="#{msgs['updateProfile.usernameText']}"/>
                <h:outputText id="username" value="#{updateProfileController.model.username}" style="font-weight:bold"/>

                <h:outputLabel for="email" value="#{msgs['updateProfile.emailText']}"/>
                <h:outputText id="email" value="#{updateProfileController.model.email}" style="font-weight:bold"/>

                <h:outputLabel for="fullname" value="#{msgs['updateProfile.fullnameText']}"/>
                <p:inputText value="#{updateProfileController.model.fullname}"
                             id="fullname" required="true" label="#{msgs['updateProfile.fullnameText']}"/>

                <h:outputLabel for="dob" value="#{msgs['updateProfile.dobText']}"/>
                <p:inputMask value="#{updateProfileController.model.dob}" mask="99/99/9999"
                             id="dob" required="true" label="#{msgs['updateProfile.dobText']}">
                    <f:convertDateTime pattern="dd/MM/yyyy"/>
                </p:inputMask>

                <h:outputLabel for="address" value="#{msgs['updateProfile.addressText']}"/>
                <p:inputText value="#{updateProfileController.model.address}"
                             id="address" required="true" label="#{msgs['updateProfile.addressText']}"/>

                <h:outputLabel for="phonenumber" value="#{msgs['updateProfile.phonenumberText']}"/>
                <p:inputText value="#{updateProfileController.model.phoneNumber}"
                             id="phonenumber" required="true" label="#{msgs['updateProfile.phonenumberText']}"/>

                <f:facet name="footer">
                    <div align="center">
                        <p:commandButton id="updateProfileBtn" value="#{msgs['updateProfile.updateText']}" image="ui-icon ui-icon-pencil" action="#{updateProfileController.updateProfile}" type="submit" update="growl"/>
                        &nbsp;<p:commandButton value="#{msgs['updateProfile.cancelText']}" image="ui-icon ui-icon-closethick" onclick="dlgUpdateProfile.hide()"/>
                    </div>
                </f:facet>
            </h:panelGrid>
        </p:dialog>
    </h:form>

    <h:form id="frmUserCP">
        <ul>
            <li class="page_item"><p:commandLink title="#{msgs['updateProfile.title']}" value="#{msgs['updateProfile.title']}" update="frmUpdateProfile:grdUpdateProfile" oncomplete="dlgUpdateProfile.show()"/></li>
            <li class="page_item"><p:commandLink title="#{msgs['changepwd.title']}" value="#{msgs['changepwd.title']}" update="frmChangePwd:grdChangePwd" oncomplete="dlgChangePwd.show()"/></li>
            <li class="page_item"><p:commandLink action="#{loginController.logout}" title="#{msgs['usercp.logoutText']}" value="#{msgs['usercp.logoutText']}"/></li>
        </ul>
    </h:form>
</li>

</ui:composition>